<!DOCTYPE html>

<html lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<!-- SCRIPTS
		---- jquery.min.js: jquery function library
		---- popup.js: contains main page behavior functions -->
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
		<script type="text/javascript" src="scripts/popup.js"></script>
		
		<!-- STYLESHEETS
		---- theme.css: contains extension-wide general style settings
		---- popup.css: contains page-specific style settings -->
		<link rel="stylesheet" type="text/css" href="stylesheets/theme.css" />
		<link rel="stylesheet" type="text/css" href="stylesheets/popup.css" />
	</head>
	
	<body>
		<form id="mainContainer">
			<header id="messageBar">
				<section id="messageBarText">
					<!-- messages will be shown here if needed -->
				</section>
			</header>
			<!-- Archive Section -->
			<section id="archiveSection">
				<summary>Archive:</summary>
				<select name="archives" id="archiveList">
					<option value="internetarchive">Internet Archive</option>
					<option value="google">Google Cache</option>
					<option value="coralcdn">CoralCDN</option>
				</select>
			</section>
			
			<!-- URL Input Section -->
			<section id="urlInputSection">
				<summary>http://</summary> <input type="search" id="searchurl" placeholder="Enter a search address" autofocus/>
			</section>
			
			<!-- Main Buttons -->
			<section id="buttonSection">
				<button id="searchTypeBtn" class="roundButton" type="button">Advanced Search</button>
				<button id="lookupButton" class="roundButton" type="submit">Lookup Page</button>
			</section>
			
			<!-- Footer -->
			<footer>
				<button id="homepageLink" class="rectButton" type="button">Homepage</button>
				<!-- options page to be implemented in next update (I promise this time!)
				<button id="optionsButton" class="rectButton" type="button">Options</button> -->
			</footer>
		</form>
	</body>
</html>